<template>
  <div>
    <!-- 有自定义模版结构 -->
    <div class="container" v-if="temp_style && temp_style != -1">
      <div class="wxCode-current" v-if="mini_url && show_qrcode">
        <div class="code">
          <img v-bind:src="mini_url" />
        </div>
      </div>
      <div class="in-container">
        <div class="action-btn">
          <a
            href="javascript:;"
            class="activeCenter"
            v-on:click="_GetAllActivity"
          ></a>
          <a
            href="javascript:;"
            class="reward-log"
            v-on:click="_GetUserLotteryLog"
          ></a>
          <a
            href="javascript:;"
            class="gm-jq"
            v-on:click="buyQuanFlag = true"
          ></a>
          <a href="javascript:;" v-on:click="_GetOrders" class="gmjl"></a>
          <a v-bind:href="baseData.jump_url" class="back"></a>
        </div>

        <!-- 头部 -->
        <div class="header">
          <h1>{{ baseData.title }}</h1>
          <div class="user-box">
            <span><i class="game-icon"></i>{{ baseData.map_name }}</span>
            <span><i class="user-icon"></i>{{ baseData.user_name }}</span>
          </div>
          <div class="timer">
            活动有效期：<span>{{ st_time }} 至 {{ ed_time }}</span>
          </div>
        </div>
        <!-- 头部 -->
        <!-- 抽奖部分 -->
        <div class="lottery-box">
          <div class="lottery-box-left">
            <a href="javascript:;" v-on:click="_LotteryOne" class="one"></a>
            <a href="javascript:;" v-on:click="_LotteryTen" class="ten"></a>
            <div class="lottery-limit">
              剩余<em>{{ baseData.lottery_chip }}</em
              >张抽奖券({{ ed_time }}过期）
            </div>
            <div class="limit-tongBao">
              <div class="radio-sex">
                <input
                  type="radio"
                  id="sex1"
                  name="sex1"
                  v-model="isChecked"
                  value="true"
                  @click="handleChecked"
                />
                <label for="sex1"> </label>
                <span>消耗通宝兑换 (通宝余额:<em>400000</em>)</span>
              </div>
              <div class="dhmx" @click="chargeDetialFn">兑换明细></div>
            </div>
            <ul>
              <li
                v-for="(item, index) in baseData.lottery_list"
                v-bind:class="`pic${index + 1}`"
                v-bind:key="index"
                v-on:mouseenter="onMouseOver(item, $event)"
                v-on:mouseleave="onMouseOut(item)"
              >
                <div
                  class="detail-info"
                  v-show="item.seen"
                  :style="{ left: tranLeft, top: tranTop }"
                >
                  <div class="in-detail-info">
                    <div class="row" v-show="item.price">
                      <em class="jiazhi"></em> <span>奖项价值:</span
                      ><b>{{ item.price }}元</b>
                    </div>
                    <div class="row2" v-show="item.desc">
                      <div class="title"><em class="sm"></em>奖项说明：</div>
                      <div>{{ item.desc }}</div>
                    </div>
                    <div class="row2" v-show="item.gift_detail">
                      <div class="title">
                        <em class="mingxi"></em>奖品明细：
                      </div>
                      <div>{{ item.gift_detail }}</div>
                    </div>
                  </div>
                </div>
                <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                <i v-if="!item.rarity" class="common-tx"></i>
                <img
                  v-if="item.is_joke == false"
                  v-bind:src="item.icon"
                  alt=""
                />
                <img
                  v-if="item.is_joke == true"
                  src="../assets/images/xxhg.jpg"
                  alt=""
                />
                <p>{{ item.show_name }}</p>
              </li>
            </ul>
          </div>
          <div class="lottery-box-right">
            <div class="cj-shuomin">
              <div class="cj-price">
                每购买1个活动道具即可获得1张抽奖券，抽奖券仅在本活动的有效期内使用，活动结束后就过期。本次活动的活动道具单价<em
                  >{{ baseData.price }}</em
                >元。
              </div>
              <div class="more-jq" v-on:click="buyQuanFlag = true"></div>
            </div>
            <div class="zjmd-bg">
              <vueSeamlessScroll
                :data="winningList"
                :class-option="classOption"
                class="scroll-content"
              >
                <div
                  v-for="(item, index) in winningList"
                  :key="index"
                  style="height: 30px; line-height: 30px; display: flex"
                  v-show="item.show_name != '谢谢参与'"
                >
                  <div class="scroll-prize">
                    恭喜玩家<em
                      style="color: rgba(255, 196, 54, 1); margin: 0 5px"
                      >{{ item.user_name }}</em
                    >
                    抽中奖项
                    <em style="color: rgba(255, 196, 54, 1); margin: 0 5px">{{
                      item.show_name
                    }}</em>
                  </div>
                </div>
              </vueSeamlessScroll>
            </div>
          </div>
        </div>
        <!-- 抽奖部分 -->
        <!-- 兑换 -->
        <div class="charge" v-show="baseData.show_discount">
          <a
            href="JavaScript:;"
            class="dhxh"
            v-on:click="_GetFreeLotteryLogByType"
          ></a>
          <div class="charge-icon"></div>
          <div class="charge-info">
            <h5>【{{ baseData.map_name }}】免费抽奖券</h5>
            <p class="timer-limit">
              兑换条件/期限：<span> {{ ct_need }} 抽奖积分</span>可额外兑换
              <span>{{ ct_send }} </span> 张免费抽奖券 /
              <a href="javascript:;">（{{ ed_time }} 之前）</a>
            </p>
            <div class="charge-info-box">
              <p>兑换说明：</p>
              <p>
                1）兑换免费抽奖券需要消耗抽奖积分，使用购买活动道具赠送得抽奖券抽奖可获得抽奖积分（使用免费抽奖券抽奖不能获得抽奖积分），
              </p>
              <p>每抽1次获得1积分；</p>
              <p>
                2）免费抽奖券只能在本次活动中使用，且仅在活动时间内有效，活动下线后未使用的免费抽奖券将自动失效，请兑换后及时使用。
              </p>
            </div>
          </div>
          <div class="last-jifen">剩余积分:{{ ct_mine }}</div>
          <a
            href="javascript:;"
            class="ljdh"
            v-on:click="_LotteryDiscountCharge"
            >立即兑换</a
          >
        </div>
        <!-- 兑换 -->
        <!-- 活动任务兑换 -->
        <div class="task-box" v-show="baseData.show_limited">
          <div class="xian"></div>
          <div class="task-title">
            <i class="gifts"></i>
            <div class="litmit-action">
              <span
                >限定奖励-<em
                  style="cursor: pointer"
                  v-on:click="limitFlag = true"
                  >奖励说明></em
                >
              </span>
              <a href="javascript:;" v-on:click="_GetLimitedHistory"
                >领取记录></a
              >
            </div>
          </div>
          <ul>
            <li v-for="(item, index) in limitLts" v-bind:key="index">
              <div
                class="pic-box2"
                v-on:mouseenter="onMouseOver(item, $event)"
                v-on:mouseleave="onMouseOut(item)"
              >
                <div
                  class="detail-info"
                  v-show="item.seen"
                  :style="{ left: tranLeft, top: tranTop }"
                >
                  <div class="in-detail-info">
                    <div class="row" v-show="item.price">
                      <em class="jiazhi"></em> <span>奖项价值:</span
                      ><b>{{ item.price }}元</b>
                    </div>
                    <div class="row2" v-show="item.desc">
                      <div class="title"><em class="sm"></em>奖项说明：</div>
                      <div>{{ item.desc }}</div>
                    </div>
                    <div class="row2" v-show="item.show_desc">
                      <div class="title">
                        <em class="mingxi"></em>奖品明细：
                      </div>
                      <div>{{ item.show_desc }}</div>
                    </div>
                  </div>
                </div>
                <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                <i v-if="!item.rarity" class="common-tx"></i>
                <img v-bind:src="item.img" alt="" />
              </div>
              <div class="task-right">
                <h5>{{ item.name }}</h5>
                <div class="task-right-info">
                  <p>
                    领取条件：<span v-if="item.lt == 1">日</span
                    ><span v-if="item.lt == 2">周</span
                    ><span v-if="item.lt == 3">总</span>
                    <span
                      >抽奖次数达到<em>{{ item.bigger }}</em></span
                    >
                  </p>
                  <p>
                    <span v-if="item.remain != -1">
                      剩余可领取数量:
                      <em>{{ `${item.remain} /` }}</em
                      ><i>{{ item.num_get }}</i>
                      <i
                        style="
                          font-size: 16px;
                          cursor: pointer;
                          color: rgba(255, 58, 50, 1);
                          margin-left: 5px;
                          font-weight: bold;
                        "
                        class="el-icon-warning-outline"
                        title="奖励数量有限，先领先得，领完为止。当可领取数量为0时，奖励不可领取。"
                      ></i>
                    </span>
                    <span
                      v-if="item.remain != -1 && item.num_chargejf"
                      style="margin: 0 10px"
                    >
                      |
                    </span>
                    <span v-if="item.num_chargejf">
                      可兑换积分数: <em>{{ item.num_chargejf }}</em
                      >地图积分

                      <i
                        style="
                          font-size: 16px;
                          cursor: pointer;
                          color: rgba(255, 58, 50, 1);
                          margin-left: 5px;
                          font-weight: bold;
                        "
                        class="el-icon-warning-outline"
                        title="如果你已经拥有此道具且时间无法再相加，
领取后奖励会被分解成地图积分发放。"
                      ></i>
                    </span>
                  </p>
                  <p
                    v-bind:title="item.show_desc"
                    class="send"
                    v-show="item.show_desc.length >= 100"
                  >
                    发放物品:{{ item.show_desc.slice(0, 100) + "……" }}
                  </p>
                  <p class="send" v-show="item.show_desc.length < 100">
                    发放物品:{{ item.show_desc }}
                  </p>
                </div>
              </div>
              <div class="task-btn">
                <a
                  href="javascript:;"
                  v-if="item.rcv_flag == 0"
                  class="lq"
                  v-on:click="_RcvLimitedGift(item.sort)"
                  >领取</a
                >
                <a
                  href="javascript:;"
                  v-if="item.rcv_flag == 1"
                  class="ylq"
                  v-on:click="_RcvLimitedGift(item.sort)"
                  >已领取</a
                >
                <a
                  href="javascript:;"
                  v-if="item.rcv_flag == -1 || item.rcv_flag == -2"
                  class="bklq"
                  v-on:click="_RcvLimitedGift(item.sort)"
                  >不可领取</a
                >
              </div>
              <div class="time-end">
                <span v-if="item.lt == 1"
                  ><em
                    style="color: #fff; padding-left: 10px; margin-right: 10px"
                    >领取期限:</em
                  ><em style="color: rgba(255, 193, 27, 1)"
                    >今日24:00之前</em
                  ></span
                >
                <span v-if="item.lt == 2"
                  ><em
                    style="color: #fff; padding-left: 10px; margin-right: 10px"
                    >领取期限:</em
                  ><em style="color: rgba(255, 193, 27, 1)"
                    >本周日24:00之前</em
                  ></span
                >
                <span v-if="item.lt == 3"
                  ><em
                    style="color: #fff; padding-left: 10px; margin-right: 10px"
                    >领取期限:</em
                  ><em style="color: rgba(255, 193, 27, 1)">{{
                    ed_time
                  }}</em></span
                >
              </div>
            </li>
          </ul>
        </div>
        <!-- 活动任务兑换 -->

        <!-- 说明 -->
        <div class="shuoming">
          <div class="xian"></div>
          <div class="shuoming-title">
            <i class="shuoming-icon"></i>
            <span>活动说明</span>
          </div>
          <p>
            1、活动有效期:<em>{{ st_time }} 至 {{ ed_time }}</em>
          </p>

          <p>2、抽奖概率&地图积分转化说明：</p>
          <p>
            1）表中所用“概率”均是在大样本(抽奖次数达到
            {{
              baseData.pool
            }})的统计数值，与单个玩家的少量测试数据之间可能会存在一定差异。
          </p>
          <p>
            2）在设置转换积分的情况下，玩家抽取到的道具：
            ①已经拥有该道具，且道具的数量或有效时限可以叠加，系统发放时会自动为玩家叠加；
            ②已经有永久道具无法再叠加，抽取到相同的限时/永久道具时，将为玩家自动将抽取到的道具分解为当前地图签到积分，用户可使用积分去地图积分商城兑换其他物品。
          </p>
          <p>具体请看作者设置，详情请见下表：</p>
          <div class="reward">
            <div class="reward-hd">
              <span style="width: 220px">奖项名称</span>
              <span style="width: 98px">概率</span>
              <span style="width: 100px">稀有度</span>
              <span style="width: 100px">兑换积分数</span>
              <span style="width: 100px">价值</span>
              <span style="width: 530px; text-align: left">奖品明细</span>
            </div>
            <ul>
              <li
                v-for="(item, index) in baseData.portable_list"
                v-bind:key="index"
              >
                <span style="width: 220px">{{ item.show_name }}</span>
                <span style="width: 98px">{{ item.detail }}</span>
                <span style="width: 100px">{{
                  item.rarity == null ? "-" : item.rarity
                }}</span>
                <span style="width: 100px">{{ item.num_chargejf }}</span>
                <span style="width: 100px">{{
                  item.price == null ? "-" : item.price
                }}</span>
                <span
                  v-bind:title="item.gift_detail"
                  style="
                    width: 530px;
                    text-align: left;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                  "
                  >{{ item.gift_detail }}</span
                >
              </li>
            </ul>
            <p>3.活动免责说明:</p>
            <p>
              本次活动所有内容均由活动地图的地图作者自定义，11对战平台秉着公平、公正、公开、真实的原则，对于本次抽奖活动，我司声明以下免责条款，参加活动前请
              用户仔细阅读所有条款，参加本次活动即表明用户了解并接受所有条款内容。具体参见
              <a href="javascript:;" v-on:click="mzFlag = true" class="mz-more"
                >详细条款>></a
              >
              。
            </p>
          </div>
        </div>
        <!-- 说明 -->
      </div>
      <!-- 获取奖券 -->
      <transition name="fade">
        <div class="model" v-show="buyQuanFlag">
          <div class="in-model">
            <i class="close" v-on:click="buyQuanFlag = false"></i>
            <div class="tishi"></div>
            <div class="info-box">
              <img src="../assets/images/miyao2.jpg" alt="" />
              <div class="info-box-right">
                <p>限定称号-穷得只剩宝箱</p>
                <div class="price">
                  单价：<em
                    style="font-size: 18px; color: rgba(255, 39, 39, 1)"
                    >{{ baseData.price }}</em
                  >
                  元/1天
                </div>
                <p style="font-size: 14px">
                  购买即赠送本次活动的抽奖券，每购买一个道具赠送一张抽奖券
                </p>
                <div class="num-box">
                  <el-input-number
                    v-model="num"
                    @change="handleChange"
                    :min="1"
                    label="描述文字"
                    size="small"
                  ></el-input-number>
                </div>
              </div>
            </div>
            <div class="info-act">
              <img src="../assets/images/zensong.jpg" alt="" />
              <div class="info-act-right">
                <p>【{{ baseData.map_name }}】活动抽奖券</p>
                <p>有效期：（{{ ed_time }}前有效）</p>
                <p>
                  使用说明：抽奖券仅可在本次活动中使用，且活动下线后失效，获得抽奖券后请及时使用。
                </p>
              </div>
            </div>
            <div class="info-action">
              <div class="tb-bg">
                <div class="radio-sex">
                  <input
                    type="radio"
                    id="sex2"
                    name="sex2"
                    v-model="chargeChecked"
                    @click="chargeCheckedFn"
                    value="true"
                  />
                  <label for="sex2"> </label>
                  <span>消耗通宝兑换 (通宝余额:<em>400000</em>)</span>
                </div>
              </div>
              <a href="javascript:;" class="ljgm-btn" v-on:click="Ticket"
                >立即购买</a
              >
            </div>
          </div>
        </div>
      </transition>
      <!-- 取消通宝支付弹框 -->
      <transition name="fade">
        <div class="model2" v-show="tbtsFlag">
          <div class="tb-kuang">
            <i class="tb-close" @click="tbtsFlag = false">×</i>
            <div class="tb-tishi">
              勾选【消耗通宝兑换】,系统将优先消耗您的通宝余额参加活动。确定取消【消耗通宝兑换】?
            </div>
            <div class="tb-action">
              <a href="javascript:;" class="tb-sure" @click="tbtsFn"></a>
              <a
                href="javascript:;"
                class="tb-qx"
                @click="tbtsFlag = false"
              ></a>
            </div>
          </div>
        </div>
      </transition>
      <!-- 取消通宝支付弹框 -->

      <!-- 取消通宝支付弹框2 -->
      <transition name="fade">
        <div class="model2" v-show="tbtsFlag2">
          <div class="tb-kuang">
            <i class="tb-close" @click="tbtsFlag2 = false">×</i>
            <div class="tb-tishi">
              勾选【消耗通宝兑换】,系统将优先消耗您的通宝余额参加活动。确定取消【消耗通宝兑换】?
            </div>
            <div class="tb-action">
              <a href="javascript:;" class="tb-sure" @click="tbtsFn2"></a>
              <a
                href="javascript:;"
                class="tb-qx"
                @click="tbtsFlag2 = false"
              ></a>
            </div>
          </div>
        </div>
      </transition>
      <!-- 取消通宝支付弹框2 -->

      <!-- 获取奖券 -->

      <!-- 通宝兑换明细 -->
      <transition name="fade">
        <div class="model" v-show="dhmxFlag">
          <div class="in-model">
            <i class="close" @click="dhmxFlag = false"></i>
            <h1>通宝兑换记录</h1>
            <div class="list-hd">
              <span>兑换时间</span><span>兑换物品</span> <span>类型</span
              ><span>消耗通宝数</span><span>兑换状态</span><span>关联支付</span>
            </div>
            <ul class="list-bd">
              <li>
                <span>1231</span>
                <span>321321</span>
                <span>32131</span>
                <span>32131</span>
                <span>32131</span>
                <span>32131</span>
              </li>
            </ul>
          </div>
        </div>
      </transition>
      <!-- 通宝兑换明细 -->

      <!-- 兑换消耗记录 -->
      <transition name="fade">
        <div class="model" v-show="freeLogFlag">
          <div class="in-model">
            <i class="close" v-on:click="freeLogFlag = false"></i>
            <div class="tab-hd">
              <span
                v-bind:class="{ cur: type_id == 1 }"
                v-on:click="changeCur(1)"
                >兑换记录</span
              ><span
                v-bind:class="{ cur: type_id == 2 }"
                v-on:click="changeCur(2)"
                >消耗记录</span
              >
            </div>
            <div class="list-hd">
              <span>账号</span><span>数量</span> <span>时间</span>
            </div>
            <ul class="list-bd" style="height: 345px">
              <li v-for="(item, index) in freeLts" v-bind:key="index">
                <span>{{ item.user_name }}</span>
                <span>{{ item.num_get }}</span>
                <span>{{ item.str_create_time }}</span>
              </li>
            </ul>
            <div class="page-action" v-if="freeLts.length > 0">
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total2"
                @current-change="handleCurrentChange2"
              >
              </el-pagination>
            </div>
          </div>
        </div>
      </transition>

      <!-- 兑换记录 -->
      <!-- 活动任务奖励领取记录 -->
      <transition name="fade">
        <div class="model" v-show="limitLogFlag">
          <div class="in-model">
            <i class="close" v-on:click="limitLogFlag = false"></i>
            <h1>抽奖限定奖励领取纪录</h1>
            <div class="list-hd">
              <span>领取条件</span><span>领取用户</span> <span>领取时间</span
              ><span>领取道具</span>
            </div>
            <ul class="list-bd">
              <li v-for="(item, index) in limitLogLts" v-bind:key="index">
                <span>{{ item.tpdesc }}</span>
                <span>{{ item.user_name }}</span>
                <span>{{ item.str_create_time }}</span>
                <span>{{ item.show_name }}</span>
              </li>
            </ul>
          </div>
        </div>
      </transition>

      <!-- 活动任务奖励领取记录 -->
      <!-- 单抽弹框 -->
      <transition name="fade">
        <div class="model" v-show="oneModelFlag">
          <div class="in-model">
            <i class="close" v-on:click="closeOnceLottery"></i>
            <h5>
              恭喜你抽中以下奖品，<em
                v-if="one__total_price > 0"
                style="
                  margin: 0 2px;
                  font-size: 16px;
                  font-weight: bold;
                  color: red;
                "
                >价值{{ one__total_price }}元</em
              >请至背包中查看！
            </h5>

            <div class="pic-main">
              <div
                class="pic-box"
                v-for="(item, index) in show_nameList"
                v-bind:key="index"
              >
                <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                <i v-if="!item.rarity" class="common-tx"></i>
                <img v-bind:src="item.image" alt="" v-if="!item.is_joke" />
                <img
                  v-if="item.is_joke == true"
                  src="../assets/images/xxhg.jpg"
                  alt=""
                />
                <div class="jifen" v-if="item.send_jf">
                  分解为<em>{{ item.send_jf }}</em
                  >积分
                </div>
                <div class="show_name" v-if="item.show_name">
                  {{ item.show_name }}
                </div>
              </div>
            </div>

            <!-- <a href="javascript:;" class="sure" v-on:click="closeOnceLottery"
            >确定</a
          > -->
            <div class="user-lottery">
              <a href="javascript:;" v-on:click="_LotteryOne" class="agin"></a>
              <a
                href="javascript:;"
                v-on:click="_LotteryTen"
                class="ten-agin"
              ></a>
            </div>
          </div>
        </div>
      </transition>

      <!-- 单抽弹框 -->

      <!-- 十抽 -->
      <transition name="fade">
        <div class="model" v-show="TenFlagModel">
          <div class="in-model">
            <i class="close" v-on:click="closeTenLottery"></i>
            <div class="gongxi">
              恭喜你抽中以下奖项！<span v-if="ten_total_price > 0"
                >价值{{ ten_total_price }}元！</span
              >
            </div>
            <div class="ten-list">
              <div
                class="ten-item"
                v-for="(item, index) in TenRewardLists"
                v-bind:key="index"
              >
                <div class="ten-item-box">
                  <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                  <i v-if="!item.rarity" class="common-tx"></i>
                  <img v-bind:src="item.image" v-if="!item.is_joke" alt="" />
                  <img
                    v-if="item.is_joke == true"
                    src="../assets/images/xxhg.jpg"
                    alt=""
                  />
                  <div class="jifen" v-if="item.send_jf">
                    分解为<em>{{ item.send_jf }}</em
                    >积分
                  </div>
                  <div class="show_name" v-if="item.show_name">
                    {{ item.show_name }}
                  </div>
                </div>
              </div>
            </div>
            <!-- <a href="javascript:;" v-on:click="closeTenLottery" class="sure"
            >确定</a
          > -->
            <div class="user-lottery">
              <a href="javascript:;" v-on:click="_LotteryOne" class="agin"></a>
              <a
                href="javascript:;"
                v-on:click="_LotteryTen"
                class="ten-agin"
              ></a>
            </div>
          </div>
        </div>
      </transition>

      <!-- 十抽 -->
      <!-- 购买记录 -->
      <div class="model" v-show="gmLogFlag">
        <div class="in-model">
          <i class="close" v-on:click="gmLogFlag = false"></i>
          <h1>购买记录</h1>
          <div class="list-hd">
            <span>购买用户</span><span>购买时间</span><span>购买物品*数量</span>
            <span style="flex: 2">支付订单 </span>
          </div>
          <ul class="list-bd">
            <li v-for="(item, index) in gmOrderLts" v-bind:key="index">
              <span>{{ item.uname }}</span>
              <span>{{ item.str_time }}</span>
              <span>{{ item.shop_name }}</span>
              <span style="flex: 2">{{ item.order_id }}</span>
            </li>
          </ul>
          <div class="page-action" v-if="gmOrderLts.length > 0">
            <el-pagination
              background
              layout="prev, pager, next"
              :total="total3"
              @current-change="handleCurrentChange3"
            >
            </el-pagination>
          </div>
        </div>
      </div>
      <!-- 购买记录 -->

      <!-- 奖品明细 -->
      <transition name="fade">
        <div class="model" v-show="mxFlag" style="z-index: 11">
          <div class="in-model" style="z-index: 11">
            <i class="close" v-on:click="mxFlag = false"></i>
            <h1>中奖记录-奖品明细</h1>
            <div class="reward-detail">
              {{ mxDesc }}
            </div>
          </div>
        </div>
      </transition>

      <!-- 奖品明细 -->
      <!-- 中奖记录 -->
      <transition name="fade">
        <div class="model" v-show="rewardFlag">
          <div class="in-model">
            <i class="close" v-on:click="rewardFlag = false"></i>
            <div class="reward-main">
              <div class="reward-top">
                <div class="reward-tips">中奖记录</div>
                <p>
                  今日抽奖<span>{{ random_day }}</span
                  ><em>|</em>
                </p>
                <p>
                  本周抽奖<span>{{ random_week }}</span
                  ><em>|</em>
                </p>
                <p>
                  累计总抽奖<span>{{ random_total }}</span
                  ><em v-show="price_total != 0">|</em>
                </p>
                <p v-show="price_total != 0">
                  累计抽奖总价值<span>{{ price_total }}</span>
                </p>
                <p v-on:click="jifenFlag = true" style="cursor: pointer">
                  <em>|</em
                  ><span style="color: rgba(18, 174, 255, 1); margin-left: 10px"
                    >积分转化说明</span
                  >
                </p>
              </div>
              <ul>
                <li v-for="(item, index) in recordLists" v-bind:key="index">
                  <div class="li-tp">
                    <span>{{ item.user_name }}</span>
                    <span v-show="item.price">价值：{{ item.price }}元</span>

                    <div class="li-tp-right">
                      <span
                        >【{{
                          item.lottery_type == 1 ? "单抽" : "十抽"
                        }}】</span
                      >
                      <span>{{ item.create_time_show }}</span>
                      <span
                        ><a
                          href="javascript:;"
                          v-on:click="openMxDesc(item.lottery_desc_show)"
                          >奖品明细》</a
                        ></span
                      >
                    </div>
                  </div>
                  <div class="li-bd">
                    <div
                      class="pic-item"
                      v-for="(obj, index) in item.lst"
                      v-bind:key="index"
                      v-bind:title="obj.detail"
                    >
                      <div
                        class="mc"
                        v-if="obj.is_send_jf"
                        style="color: #fff; font-size: 12px"
                      >
                        <p style="color: #9c9c9c">分解成</p>
                        <p style="color: #9c9c9c">
                          <em>{{ obj.send_jf }}</em
                          >积分
                        </p>
                      </div>
                      <img v-if="!obj.is_joke" v-bind:src="obj.image" alt="" />
                      <img
                        v-if="obj.is_joke == true"
                        src="../assets/images/xxhg.jpg"
                        alt=""
                      />
                    </div>
                  </div>
                </li>
              </ul>
            </div>
            <div class="page-action" v-if="recordLists.length > 0">
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total"
                @current-change="handleCurrentChange"
              >
              </el-pagination>
            </div>
          </div>
        </div>
      </transition>

      <!-- 中奖记录 -->

      <!-- 限定奖励领取说明 -->

      <transition name="fade">
        <div class="model" v-show="limitFlag">
          <div class="in-model">
            <i class="close" v-on:click="limitFlag = false"></i>
            <h1>限定奖励-领取说明</h1>
            <div class="reward-detail">
              <p style="color: #fff; font-size: 16px; line-height: 38px">
                1.日抽奖次数-限定奖励的可领取数量和领取条件每日0点更新，每日可领取一次，符合领取条件的用户请于【每日24点前】及时领取，否则将无法领取。
              </p>
              <p style="color: #fff; font-size: 16px; line-height: 38px">
                2.周抽奖次数-限定奖励的可领取数量和领取条件每周一0点更新，每个自然周可领取一次，符合领取条件的用户请于【每周日24点】前及时领取，否则将无法领取。
              </p>

              <p style="color: #fff; font-size: 16px; line-height: 38px">
                3.总抽奖次数-限定奖励的可领取数量和领取条件将在活动结束时失效，活动有效期内可领取一次，符合领取条件的用户请于【活动下线前】及时领取，否则将无法领取。
              </p>
              <p
                style="
                  color: red;
                  font-weight: bold;
                  font-size: 16px;
                  line-height: 38px;
                "
              >
                4.如作者设置了奖励数量上限，则奖励数量有限，先领先得，领完为止。当可领取数量为0时，奖励不可领取。
              </p>
            </div>
          </div>
        </div>
      </transition>
      <!-- 限定奖励领取说明 -->

      <!-- 免责声明 -->
      <transition name="fade">
        <div class="model" v-show="mzFlag">
          <div class="in-model">
            <i class="close" v-on:click="mzFlag = false"></i>
            <h1>RPG自定义活动免责条款:</h1>
            <div class="reward-detail">
              <p style="color: #fff">
                1.本活动期间发生任何不可抗力事件使本抽奖活动或本次抽奖目的不能实现，11对战平台因此免责。不可抗力是指不能控制、不可预见或不能避免，即使预见亦无法避免的事件，该事件使任何一方根据本协议履行其全部或部分义务已不可能。包括社会异常事件、自然灾害或政府管制行为而造成的网络关闭等非基于11对战平台过错的行为。
              </p>
              <p style="color: #fff">
                2.鉴于互联网之特殊性质，活动期间若发生黑客攻击、电信部门技术调整导致重大影响、病毒侵袭、网络故障、带宽、域名解析故障或其他网络设备或技术提供商的服务延迟、服务障碍或任何其他类似事件，致使活动无法正常进行，11对战平台因此免责。
              </p>

              <p style="color: #fff">
                3.用户自身主观过错或恶意，如通技术手段恶意攻击或篡改致使中奖发生错误等不正当手段参与活动，恶意刷奖等类似情形致使此次抽奖无效的，11对战平台因此免责。
              </p>
              <p style="color: #fff">
                4.任何由于网络问题、黑客攻击、计算机病毒侵入或发作、因政府管制而造成的暂时性关闭等影响网络正常运行的不可抗力而造成的非正常获奖无效，11对战平台均得免责。
              </p>
            </div>
          </div>
        </div>
      </transition>

      <!-- 免责声明 -->
      <!-- 活动中心 -->
      <transition name="fade">
        <div class="model" v-show="activeFlag">
          <div class="activeMain">
            <i class="close" v-on:click="activeFlag = false"></i>
            <h1 style="margin-bottom: 20px">
              活动中心-{{ baseData.map_name }}
            </h1>
            <ul>
              <li v-for="(item, index) in activeLts" v-bind:key="index">
                <p>{{ item.str_ed_time }}结束</p>
                <em
                  v-show="act_id == item.active_id"
                  class="current-act"
                  style="color: #fd0a0a"
                ></em>
                <h5 style="text-align: left">
                  【{{
                    item.active_type == 1
                      ? "抽奖活动"
                      : item.active_type == 3
                      ? "通行证活动"
                      : ""
                  }}】 {{ item.active_title }}
                </h5>
                <a
                  v-bind:href="
                    'qfyygame:///type=web_action/?action_type=2&web_url=' +
                    item.url +
                    '&login_mode=2'
                  "
                  class="ljcy"
                ></a>
              </li>
            </ul>
          </div>
        </div>
      </transition>
      <!-- 活动中心 -->

      <!-- 积分转化说明 -->
      <div class="model" v-show="jifenFlag">
        <div class="in-model">
          <i class="close" v-on:click="jifenFlag = false"></i>
          <h1>积分转化说明</h1>
          <div class="reward-detail">
            <p style="color: #fff">
              只有符合以下情况，抽中的奖项才会被转化为积分：
            </p>
            <p style="color: #fff">
              1.该奖项有设置转化积分，如没有设置则无法转化，具体请看活动页面抽奖说明；
            </p>
            <p style="color: #fff">
              2.抽取到的物品，玩家已经提前拥有永久时效的此物品，则抽取到相同的限时/永久物品时，系统将为玩家自动将抽取到的物品分解为当前地图签到积分；否则系统发放时会自动为玩家叠加此物品的时效；
            </p>

            <p style="color: #fff">
              3.积分余额和发放记录可通过签到页面【积分兑换-消耗记录】查询对应时间点的记录。
            </p>
          </div>
        </div>
      </div>
      <!-- 积分转化说明 -->
    </div>
    <!-- 有自定义模版结构 -->

    <!-- 无自定义模版结构 -->
    <div
      class="container"
      v-if="temp_style && temp_style == -1"
      :style="{ backgroundImage: 'url(' + imageUrl + ')' }"
    >
      <div class="wxCode-current" v-if="mini_url && show_qrcode">
        <div class="code">
          <img v-bind:src="mini_url" />
        </div>
      </div>
      <div class="in-container">
        <div class="action-btn">
          <a
            href="javascript:;"
            class="activeCenter"
            v-on:click="_GetAllActivity"
          ></a>
          <a
            href="javascript:;"
            class="reward-log"
            v-on:click="_GetUserLotteryLog"
          ></a>
          <a
            href="javascript:;"
            class="gm-jq"
            v-on:click="buyQuanFlag = true"
          ></a>
          <a href="javascript:;" v-on:click="_GetOrders" class="gmjl"></a>
          <a v-bind:href="baseData.jump_url" class="back"></a>
        </div>

        <!-- 头部 -->
        <div class="header">
          <h1>{{ baseData.title }}</h1>
          <div class="user-box">
            <span><i class="game-icon"></i>{{ baseData.map_name }}</span>
            <span><i class="user-icon"></i>{{ baseData.user_name }}</span>
          </div>
          <div class="timer">
            活动有效期：<span>{{ st_time }} 至 {{ ed_time }}</span>
          </div>
        </div>
        <!-- 头部 -->
        <!-- 抽奖部分 -->
        <div class="lottery-box">
          <div class="lottery-box-left">
            <a href="javascript:;" v-on:click="_LotteryOne" class="one"></a>
            <a href="javascript:;" v-on:click="_LotteryTen" class="ten"></a>
            <div class="lottery-limit">
              剩余<em>{{ baseData.lottery_chip }}</em
              >张抽奖券({{ ed_time }}过期）
            </div>
            <div class="limit-tongBao">
              <div class="radio-sex">
                <input
                  type="radio"
                  id="sex1"
                  name="sex1"
                  v-model="isChecked"
                  @click="handleChecked($event)"
                  value="true"
                />
                <label for="sex1"> </label>
                <span>消耗通宝兑换 (通宝余额:<em>400000</em>)</span>
              </div>
              <div class="dhmx" @click="chargeDetialFn">兑换明细></div>
            </div>
            <ul>
              <li
                v-for="(item, index) in baseData.lottery_list"
                v-bind:class="`pic${index + 1}`"
                v-bind:key="index"
                v-on:mouseenter="onMouseOver(item, $event)"
                v-on:mouseleave="onMouseOut(item)"
              >
                <div
                  class="detail-info"
                  v-show="item.seen"
                  :style="{ left: tranLeft, top: tranTop }"
                >
                  <div class="in-detail-info">
                    <div class="row" v-show="item.price">
                      <em class="jiazhi"></em> <span>奖项价值:</span
                      ><b>{{ item.price }}元</b>
                    </div>
                    <div class="row2" v-show="item.desc">
                      <div class="title"><em class="sm"></em>奖项说明：</div>
                      <div>{{ item.desc }}</div>
                    </div>
                    <div class="row2" v-show="item.gift_detail">
                      <div class="title">
                        <em class="mingxi"></em>奖品明细：
                      </div>
                      <div>{{ item.gift_detail }}</div>
                    </div>
                  </div>
                </div>
                <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                <i v-if="!item.rarity" class="common-tx"></i>
                <img
                  v-if="item.is_joke == false"
                  v-bind:src="item.icon"
                  alt=""
                />
                <img
                  v-if="item.is_joke == true"
                  src="../assets/images/xxhg.jpg"
                  alt=""
                />
                <p>{{ item.show_name }}</p>
              </li>
            </ul>
          </div>
          <div class="lottery-box-right">
            <div class="cj-shuomin">
              <div class="cj-price">
                每购买1个活动道具即可获得1张抽奖券，抽奖券仅在本活动的有效期内使用，活动结束后就过期。本次活动的活动道具单价<em
                  >{{ baseData.price }}</em
                >元。
              </div>
              <div class="more-jq" v-on:click="buyQuanFlag = true"></div>
            </div>
            <div class="zjmd-bg">
              <vueSeamlessScroll
                :data="winningList"
                :class-option="classOption"
                class="scroll-content"
              >
                <div
                  v-for="(item, index) in winningList"
                  :key="index"
                  style="height: 30px; line-height: 30px; display: flex"
                  v-show="item.show_name != '谢谢参与'"
                >
                  <div class="scroll-prize">
                    恭喜玩家<em
                      style="color: rgba(255, 196, 54, 1); margin: 0 5px"
                      >{{ item.user_name }}</em
                    >
                    抽中奖项
                    <em style="color: rgba(255, 196, 54, 1); margin: 0 5px">{{
                      item.show_name
                    }}</em>
                  </div>
                </div>
              </vueSeamlessScroll>
            </div>
          </div>
        </div>
        <!-- 抽奖部分 -->
        <!-- 兑换 -->
        <div class="charge" v-show="baseData.show_discount">
          <a
            href="JavaScript:;"
            class="dhxh"
            v-on:click="_GetFreeLotteryLogByType"
          ></a>
          <div class="charge-icon"></div>
          <div class="charge-info">
            <h5>【{{ baseData.map_name }}】免费抽奖券</h5>
            <p class="timer-limit">
              兑换条件/期限：<span> {{ ct_need }} 抽奖积分</span>可额外兑换
              <span>{{ ct_send }} </span> 张免费抽奖券 /
              <a href="javascript:;">（{{ ed_time }} 之前）</a>
            </p>
            <div class="charge-info-box">
              <p>兑换说明：</p>
              <p>
                1）兑换免费抽奖券需要消耗抽奖积分，使用购买活动道具赠送得抽奖券抽奖可获得抽奖积分（使用免费抽奖券抽奖不能获得抽奖积分），
              </p>
              <p>每抽1次获得1积分；</p>
              <p>
                2）免费抽奖券只能在本次活动中使用，且仅在活动时间内有效，活动下线后未使用的免费抽奖券将自动失效，请兑换后及时使用。
              </p>
            </div>
          </div>
          <div class="last-jifen">剩余积分:{{ ct_mine }}</div>
          <a
            href="javascript:;"
            class="ljdh"
            v-on:click="_LotteryDiscountCharge"
            >立即兑换</a
          >
        </div>
        <!-- 兑换 -->
        <!-- 活动任务兑换 -->
        <div class="task-box" v-show="baseData.show_limited">
          <div class="xian"></div>
          <div class="task-title">
            <i class="gifts"></i>
            <div class="litmit-action">
              <span
                >限定奖励-<em
                  style="cursor: pointer"
                  v-on:click="limitFlag = true"
                  >奖励说明></em
                >
              </span>
              <a href="javascript:;" v-on:click="_GetLimitedHistory"
                >领取记录></a
              >
            </div>
          </div>
          <ul>
            <li v-for="(item, index) in limitLts" v-bind:key="index">
              <div
                class="pic-box2"
                v-on:mouseenter="onMouseOver(item, $event)"
                v-on:mouseleave="onMouseOut(item)"
              >
                <div
                  class="detail-info"
                  v-show="item.seen"
                  :style="{ left: tranLeft, top: tranTop }"
                >
                  <div class="in-detail-info">
                    <div class="row" v-show="item.price">
                      <em class="jiazhi"></em> <span>奖项价值:</span
                      ><b>{{ item.price }}元</b>
                    </div>
                    <div class="row2" v-show="item.desc">
                      <div class="title"><em class="sm"></em>奖项说明：</div>
                      <div>{{ item.desc }}</div>
                    </div>
                    <div class="row2" v-show="item.show_desc">
                      <div class="title">
                        <em class="mingxi"></em>奖品明细：
                      </div>
                      <div>{{ item.show_desc }}</div>
                    </div>
                  </div>
                </div>
                <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                <i v-if="!item.rarity" class="common-tx"></i>
                <img v-bind:src="item.img" alt="" />
              </div>
              <div class="task-right">
                <h5>{{ item.name }}</h5>
                <div class="task-right-info">
                  <p>
                    领取条件：<span v-if="item.lt == 1">日</span
                    ><span v-if="item.lt == 2">周</span
                    ><span v-if="item.lt == 3">总</span>
                    <span
                      >抽奖次数达到<em>{{ item.bigger }}</em></span
                    >
                  </p>
                  <p>
                    <span v-if="item.remain != -1">
                      剩余可领取数量:
                      <em>{{ `${item.remain} /` }}</em
                      ><i>{{ item.num_get }}</i>
                      <i
                        style="
                          font-size: 16px;
                          cursor: pointer;
                          color: rgba(255, 58, 50, 1);
                          margin-left: 5px;
                          font-weight: bold;
                        "
                        class="el-icon-warning-outline"
                        title="奖励数量有限，先领先得，领完为止。当可领取数量为0时，奖励不可领取。"
                      ></i>
                    </span>
                    <span
                      v-if="item.remain != -1 && item.num_chargejf"
                      style="margin: 0 10px"
                    >
                      |
                    </span>
                    <span v-if="item.num_chargejf">
                      可兑换积分数: <em>{{ item.num_chargejf }}</em
                      >地图积分
                      <i
                        style="
                          font-size: 16px;
                          cursor: pointer;
                          color: rgba(255, 58, 50, 1);
                          margin-left: 5px;
                          font-weight: bold;
                        "
                        class="el-icon-warning-outline"
                        title="如果你已经拥有此道具且时间无法再香加，
领取后奖励会被分解成地图积分发放。"
                      ></i>
                    </span>
                  </p>
                  <p
                    v-bind:title="item.show_desc"
                    class="send"
                    v-show="item.show_desc.length >= 100"
                  >
                    发放物品:{{ item.show_desc.slice(0, 100) + "……" }}
                  </p>
                  <p class="send" v-show="item.show_desc.length < 100">
                    发放物品:{{ item.show_desc }}
                  </p>
                </div>
              </div>
              <div class="task-btn">
                <a
                  href="javascript:;"
                  v-if="item.rcv_flag == 0"
                  class="lq"
                  v-on:click="_RcvLimitedGift(item.sort)"
                  >领取</a
                >
                <a
                  href="javascript:;"
                  v-if="item.rcv_flag == 1"
                  class="ylq"
                  v-on:click="_RcvLimitedGift(item.sort)"
                  >已领取</a
                >
                <a
                  href="javascript:;"
                  v-if="item.rcv_flag == -1 || item.rcv_flag == -2"
                  class="bklq"
                  v-on:click="_RcvLimitedGift(item.sort)"
                  >不可领取</a
                >
              </div>
              <div class="time-end">
                <span v-if="item.lt == 1"
                  ><em
                    style="color: #fff; padding-left: 10px; margin-right: 10px"
                    >领取期限:</em
                  ><em style="color: rgba(255, 193, 27, 1)"
                    >今日24:00之前</em
                  ></span
                >
                <span v-if="item.lt == 2"
                  ><em
                    style="color: #fff; padding-left: 10px; margin-right: 10px"
                    >领取期限:</em
                  ><em style="color: rgba(255, 193, 27, 1)"
                    >本周日24:00之前</em
                  ></span
                >
                <span v-if="item.lt == 3"
                  ><em
                    style="color: #fff; padding-left: 10px; margin-right: 10px"
                    >领取期限:</em
                  ><em style="color: rgba(255, 193, 27, 1)">{{
                    ed_time
                  }}</em></span
                >
              </div>
            </li>
          </ul>
        </div>
        <!-- 活动任务兑换 -->

        <!-- 说明 -->
        <div class="shuoming">
          <div class="xian"></div>
          <div class="shuoming-title">
            <i class="shuoming-icon"></i>
            <span>活动说明</span>
          </div>
          <p>
            1、活动有效期:<em>{{ st_time }} 至 {{ ed_time }}</em>
          </p>

          <p>2、抽奖概率&地图积分转化说明：</p>
          <p>
            1）表中所用“概率”均是在大样本(抽奖次数达到
            {{
              baseData.pool
            }})的统计数值，与单个玩家的少量测试数据之间可能会存在一定差异。
          </p>
          <p>
            2）在设置转换积分的情况下，玩家抽取到的道具：
            ①已经拥有该道具，且道具的数量或有效时限可以叠加，系统发放时会自动为玩家叠加；
            ②已经有永久道具无法再叠加，抽取到相同的限时/永久道具时，将为玩家自动将抽取到的道具分解为当前地图签到积分，用户可使用积分去地图积分商城兑换其他物品。
          </p>
          <p>具体请看作者设置，详情请见下表：</p>
          <div class="reward">
            <div class="reward-hd">
              <span style="width: 220px">奖项名称</span>
              <span style="width: 98px">概率</span>
              <span style="width: 100px">稀有度</span>
              <span style="width: 100px">兑换积分数</span>
              <span style="width: 100px">价值</span>
              <span style="width: 530px; text-align: left">奖品明细</span>
            </div>
            <ul>
              <li
                v-for="(item, index) in baseData.portable_list"
                v-bind:key="index"
              >
                <span style="width: 220px">{{ item.show_name }}</span>
                <span style="width: 98px">{{ item.detail }}</span>
                <span style="width: 100px">{{
                  item.rarity == null ? "-" : item.rarity
                }}</span>
                <span style="width: 100px">{{ item.num_chargejf }}</span>
                <span style="width: 100px">{{
                  item.price == null ? "-" : item.price
                }}</span>
                <span
                  v-bind:title="item.gift_detail"
                  style="
                    width: 530px;
                    text-align: left;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                  "
                  >{{ item.gift_detail }}</span
                >
              </li>
            </ul>
            <p>3.活动免责说明:</p>
            <p>
              本次活动所有内容均由活动地图的地图作者自定义，11对战平台秉着公平、公正、公开、真实的原则，对于本次抽奖活动，我司声明以下免责条款，参加活动前请
              用户仔细阅读所有条款，参加本次活动即表明用户了解并接受所有条款内容。具体参见
              <a href="javascript:;" v-on:click="mzFlag = true" class="mz-more"
                >详细条款>></a
              >
              。
            </p>
          </div>
        </div>
        <!-- 说明 -->
      </div>
      <!-- 获取奖券 -->
      <transition name="fade">
        <div class="model" v-show="buyQuanFlag">
          <div class="in-model">
            <i class="close" v-on:click="buyQuanFlag = false"></i>
            <div class="tishi"></div>
            <div class="info-box">
              <img src="../assets/images/miyao.jpg" alt="" />
              <div class="info-box-right">
                <p>【{{ baseData.map_name }}】限定称号-宝箱密钥</p>
                <div class="price">
                  单价：<em
                    style="font-size: 18px; color: rgba(255, 39, 39, 1)"
                    >{{ baseData.price }}</em
                  >
                  元/1天
                </div>
                <p style="font-size: 14px">
                  购买即赠送本次活动的抽奖券，每购买一个道具赠送一张抽奖券
                </p>
                <div class="num-box">
                  <el-input-number
                    v-model="num"
                    @change="handleChange"
                    :min="1"
                    label="描述文字"
                    size="small"
                  ></el-input-number>
                </div>
              </div>
            </div>
            <div class="info-act">
              <img src="../assets/images/zensong.jpg" alt="" />
              <div class="info-act-right">
                <p>活动抽奖券</p>
                <p>有效期：（{{ ed_time }}前有效）</p>
                <p>
                  使用说明：抽奖券仅可在本次活动中使用，且活动下线后失效，获得抽奖券后请及时使用。
                </p>
              </div>
            </div>
            <div class="info-action">
              <div class="tb-bg">
                <div class="radio-sex">
                  <input
                    type="radio"
                    id="sex2"
                    name="sex2"
                    v-model="chargeChecked"
                    @click="chargeCheckedFn"
                    value="true"
                  />
                  <label for="sex2"> </label>
                  <span>消耗通宝兑换 (通宝余额:<em>400000</em>)</span>
                </div>
              </div>
              <a href="javascript:;" class="ljgm-btn" v-on:click="Ticket"
                >立即购买</a
              >
            </div>
          </div>
        </div>
      </transition>
      <!-- 取消通宝支付弹框 -->
      <transition name="fade">
        <div class="model2" v-show="tbtsFlag">
          <div class="tb-kuang">
            <i class="tb-close" @click="tbtsFlag = false">×</i>
            <div class="tb-tishi">
              勾选【消耗通宝兑换】,系统将优先消耗您的通宝余额参加活动。确定取消【消耗通宝兑换】?
            </div>
            <div class="tb-action">
              <a href="javascript:;" class="tb-sure" @click="tbtsFn"></a>
              <a
                href="javascript:;"
                class="tb-qx"
                @click="tbtsFlag = false"
              ></a>
            </div>
          </div>
        </div>
      </transition>
      <!-- 取消通宝支付弹框 -->

      <!-- 取消通宝支付弹框2 -->
      <transition name="fade">
        <div class="model2" v-show="tbtsFlag2">
          <div class="tb-kuang">
            <i class="tb-close" @click="tbtsFlag2 = false">×</i>
            <div class="tb-tishi">
              勾选【消耗通宝兑换】,系统将优先消耗您的通宝余额参加活动。确定取消【消耗通宝兑换】?
            </div>
            <div class="tb-action">
              <a href="javascript:;" class="tb-sure" @click="tbtsFn2"></a>
              <a
                href="javascript:;"
                class="tb-qx"
                @click="tbtsFlag2 = false"
              ></a>
            </div>
          </div>
        </div>
      </transition>
      <!-- 取消通宝支付弹框2 -->

      <!-- 获取奖券 -->

      <!-- 通宝兑换明细 -->
      <transition name="fade">
        <div class="model" v-show="dhmxFlag">
          <div class="in-model">
            <i class="close" @click="dhmxFlag = false"></i>
            <h1>通宝兑换记录</h1>
            <div class="list-hd">
              <span>兑换时间</span><span>兑换物品</span> <span>类型</span
              ><span>消耗通宝数</span><span>兑换状态</span><span>关联支付</span>
            </div>
            <ul class="list-bd">
              <li>
                <span>1231</span>
                <span>321321</span>
                <span>32131</span>
                <span>32131</span>
                <span>32131</span>
                <span>32131</span>
              </li>
            </ul>
          </div>
        </div>
      </transition>
      <!-- 通宝兑换明细 -->

      <!-- 兑换消耗记录 -->
      <transition name="fade">
        <div class="model" v-show="freeLogFlag">
          <div class="in-model">
            <i class="close" v-on:click="freeLogFlag = false"></i>
            <div class="tab-hd">
              <span
                v-bind:class="{ cur: type_id == 1 }"
                v-on:click="changeCur(1)"
                >兑换记录</span
              ><span
                v-bind:class="{ cur: type_id == 2 }"
                v-on:click="changeCur(2)"
                >消耗记录</span
              >
            </div>
            <div class="list-hd">
              <span>账号</span><span>数量</span> <span>时间</span>
            </div>
            <ul class="list-bd" style="height: 345px">
              <li v-for="(item, index) in freeLts" v-bind:key="index">
                <span>{{ item.user_name }}</span>
                <span>{{ item.num_get }}</span>
                <span>{{ item.str_create_time }}</span>
              </li>
            </ul>
            <div class="page-action" v-if="freeLts.length > 0">
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total2"
                @current-change="handleCurrentChange2"
              >
              </el-pagination>
            </div>
          </div>
        </div>
      </transition>

      <!-- 兑换记录 -->
      <!-- 活动任务奖励领取记录 -->
      <transition name="fade">
        <div class="model" v-show="limitLogFlag">
          <div class="in-model">
            <i class="close" v-on:click="limitLogFlag = false"></i>
            <h1>抽奖限定奖励领取纪录</h1>
            <div class="list-hd">
              <span>领取条件</span><span>领取用户</span> <span>领取时间</span
              ><span>领取道具</span>
            </div>
            <ul class="list-bd">
              <li v-for="(item, index) in limitLogLts" v-bind:key="index">
                <span>{{ item.tpdesc }}</span>
                <span>{{ item.user_name }}</span>
                <span>{{ item.str_create_time }}</span>
                <span>{{ item.show_name }}</span>
              </li>
            </ul>
          </div>
        </div>
      </transition>

      <!-- 活动任务奖励领取记录 -->
      <!-- 单抽弹框 -->
      <transition name="fade">
        <div class="model" v-show="oneModelFlag">
          <div class="in-model">
            <i class="close" v-on:click="closeOnceLottery"></i>
            <h5>
              恭喜你抽中以下奖品，<em
                v-if="one__total_price > 0"
                style="
                  margin: 0 2px;
                  font-size: 16px;
                  font-weight: bold;
                  color: red;
                "
                >价值{{ one__total_price }}元</em
              >请至背包中查看！
            </h5>

            <div class="pic-main">
              <div
                class="pic-box"
                v-for="(item, index) in show_nameList"
                v-bind:key="index"
              >
                <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                <i v-if="!item.rarity" class="common-tx"></i>
                <img v-bind:src="item.image" alt="" v-if="!item.is_joke" />
                <img
                  v-if="item.is_joke == true"
                  src="../assets/images/xxhg.jpg"
                  alt=""
                />
                <div class="jifen" v-if="item.send_jf">
                  分解为<em>{{ item.send_jf }}</em
                  >积分
                </div>
                <div class="show_name" v-if="item.show_name">
                  {{ item.show_name }}
                </div>
              </div>
            </div>

            <!-- <a href="javascript:;" class="sure" v-on:click="closeOnceLottery"
            >确定</a
          > -->
            <div class="user-lottery">
              <a href="javascript:;" v-on:click="_LotteryOne" class="agin"></a>
              <a
                href="javascript:;"
                v-on:click="_LotteryTen"
                class="ten-agin"
              ></a>
            </div>
          </div>
        </div>
      </transition>

      <!-- 单抽弹框 -->

      <!-- 十抽 -->
      <transition name="fade">
        <div class="model" v-show="TenFlagModel">
          <div class="in-model">
            <i class="close" v-on:click="closeTenLottery"></i>
            <div class="gongxi">
              恭喜你抽中以下奖项！<span v-if="ten_total_price > 0"
                >价值{{ ten_total_price }}元！</span
              >
            </div>
            <div class="ten-list">
              <div
                class="ten-item"
                v-for="(item, index) in TenRewardLists"
                v-bind:key="index"
              >
                <div class="ten-item-box">
                  <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                  <i v-if="!item.rarity" class="common-tx"></i>
                  <img v-bind:src="item.image" v-if="!item.is_joke" alt="" />
                  <img
                    v-if="item.is_joke == true"
                    src="../assets/images/xxhg.jpg"
                    alt=""
                  />
                  <div class="jifen" v-if="item.send_jf">
                    分解为<em>{{ item.send_jf }}</em
                    >积分
                  </div>
                  <div class="show_name" v-if="item.show_name">
                    {{ item.show_name }}
                  </div>
                </div>
              </div>
            </div>
            <!-- <a href="javascript:;" v-on:click="closeTenLottery" class="sure"
            >确定</a
          > -->
            <div class="user-lottery">
              <a href="javascript:;" v-on:click="_LotteryOne" class="agin"></a>
              <a
                href="javascript:;"
                v-on:click="_LotteryTen"
                class="ten-agin"
              ></a>
            </div>
          </div>
        </div>
      </transition>

      <!-- 十抽 -->
      <!-- 购买记录 -->
      <div class="model" v-show="gmLogFlag">
        <div class="in-model">
          <i class="close" v-on:click="gmLogFlag = false"></i>
          <h1>购买记录</h1>
          <div class="list-hd">
            <span>购买用户</span><span>购买时间</span><span>购买物品*数量</span>
            <span style="flex: 2">支付订单 </span>
          </div>
          <ul class="list-bd">
            <li v-for="(item, index) in gmOrderLts" v-bind:key="index">
              <span>{{ item.uname }}</span>
              <span>{{ item.str_time }}</span>
              <span>{{ item.shop_name }}</span>
              <span style="flex: 2">{{ item.order_id }}</span>
            </li>
          </ul>
          <div class="page-action" v-if="gmOrderLts.length > 0">
            <el-pagination
              background
              layout="prev, pager, next"
              :total="total3"
              @current-change="handleCurrentChange3"
            >
            </el-pagination>
          </div>
        </div>
      </div>
      <!-- 购买记录 -->

      <!-- 奖品明细 -->
      <transition name="fade">
        <div class="model" v-show="mxFlag" style="z-index: 11">
          <div class="in-model" style="z-index: 11">
            <i class="close" v-on:click="mxFlag = false"></i>
            <h1>中奖记录-奖品明细</h1>
            <div class="reward-detail">
              {{ mxDesc }}
            </div>
          </div>
        </div>
      </transition>

      <!-- 奖品明细 -->
      <!-- 中奖记录 -->
      <transition name="fade">
        <div class="model" v-show="rewardFlag">
          <div class="in-model">
            <i class="close" v-on:click="rewardFlag = false"></i>
            <div class="reward-main">
              <div class="reward-top">
                <div class="reward-tips">中奖记录</div>
                <p>
                  今日抽奖<span>{{ random_day }}</span
                  ><em>|</em>
                </p>
                <p>
                  本周抽奖<span>{{ random_week }}</span
                  ><em>|</em>
                </p>
                <p>
                  累计总抽奖<span>{{ random_total }}</span
                  ><em v-show="price_total != 0">|</em>
                </p>
                <p v-show="price_total != 0">
                  累计抽奖总价值<span>{{ price_total }}</span>
                </p>
                <p v-on:click="jifenFlag = true" style="cursor: pointer">
                  <em>|</em
                  ><span style="color: rgba(18, 174, 255, 1); margin-left: 10px"
                    >积分转化说明</span
                  >
                </p>
              </div>
              <ul>
                <li v-for="(item, index) in recordLists" v-bind:key="index">
                  <div class="li-tp">
                    <span>{{ item.user_name }}</span>
                    <span v-show="item.price">价值：{{ item.price }}元</span>

                    <div class="li-tp-right">
                      <span
                        >【{{
                          item.lottery_type == 1 ? "单抽" : "十抽"
                        }}】</span
                      >
                      <span>{{ item.create_time_show }}</span>
                      <span
                        ><a
                          href="javascript:;"
                          v-on:click="openMxDesc(item.lottery_desc_show)"
                          >奖品明细》</a
                        ></span
                      >
                    </div>
                  </div>
                  <div class="li-bd">
                    <div
                      class="pic-item"
                      v-for="(obj, index) in item.lst"
                      v-bind:key="index"
                      v-bind:title="obj.detail"
                    >
                      <div
                        class="mc"
                        v-if="obj.is_send_jf"
                        style="color: #fff; font-size: 12px"
                      >
                        <p style="color: #9c9c9c">分解成</p>
                        <p style="color: #9c9c9c">
                          <em>{{ obj.send_jf }}</em
                          >积分
                        </p>
                      </div>
                      <img v-if="!obj.is_joke" v-bind:src="obj.image" alt="" />
                      <img
                        v-if="obj.is_joke == true"
                        src="../assets/images/xxhg.jpg"
                        alt=""
                      />
                    </div>
                  </div>
                </li>
              </ul>
            </div>
            <div class="page-action" v-if="recordLists.length > 0">
              <el-pagination
                background
                layout="prev, pager, next"
                :total="total"
                @current-change="handleCurrentChange"
              >
              </el-pagination>
            </div>
          </div>
        </div>
      </transition>

      <!-- 中奖记录 -->

      <!-- 限定奖励领取说明 -->

      <transition name="fade">
        <div class="model" v-show="limitFlag">
          <div class="in-model">
            <i class="close" v-on:click="limitFlag = false"></i>
            <h1>限定奖励-领取说明</h1>
            <div class="reward-detail">
              <p style="color: #fff; font-size: 16px; line-height: 38px">
                1.日抽奖次数-限定奖励的可领取数量和领取条件每日0点更新，每日可领取一次，符合领取条件的用户请于【每日24点前】及时领取，否则将无法领取。
              </p>
              <p style="color: #fff; font-size: 16px; line-height: 38px">
                2.周抽奖次数-限定奖励的可领取数量和领取条件每周一0点更新，每个自然周可领取一次，符合领取条件的用户请于【每周日24点】前及时领取，否则将无法领取。
              </p>

              <p style="color: #fff; font-size: 16px; line-height: 38px">
                3.总抽奖次数-限定奖励的可领取数量和领取条件将在活动结束时失效，活动有效期内可领取一次，符合领取条件的用户请于【活动下线前】及时领取，否则将无法领取。
              </p>
              <p
                style="
                  color: red;
                  font-weight: bold;
                  font-size: 16px;
                  line-height: 38px;
                "
              >
                4.如作者设置了奖励数量上限，则奖励数量有限，先领先得，领完为止。当可领取数量为0时，奖励不可领取。
              </p>
            </div>
          </div>
        </div>
      </transition>
      <!-- 限定奖励领取说明 -->

      <!-- 免责声明 -->
      <transition name="fade">
        <div class="model" v-show="mzFlag">
          <div class="in-model">
            <i class="close" v-on:click="mzFlag = false"></i>
            <h1>RPG自定义活动免责条款:</h1>
            <div class="reward-detail">
              <p style="color: #fff">
                1.本活动期间发生任何不可抗力事件使本抽奖活动或本次抽奖目的不能实现，11对战平台因此免责。不可抗力是指不能控制、不可预见或不能避免，即使预见亦无法避免的事件，该事件使任何一方根据本协议履行其全部或部分义务已不可能。包括社会异常事件、自然灾害或政府管制行为而造成的网络关闭等非基于11对战平台过错的行为。
              </p>
              <p style="color: #fff">
                2.鉴于互联网之特殊性质，活动期间若发生黑客攻击、电信部门技术调整导致重大影响、病毒侵袭、网络故障、带宽、域名解析故障或其他网络设备或技术提供商的服务延迟、服务障碍或任何其他类似事件，致使活动无法正常进行，11对战平台因此免责。
              </p>

              <p style="color: #fff">
                3.用户自身主观过错或恶意，如通技术手段恶意攻击或篡改致使中奖发生错误等不正当手段参与活动，恶意刷奖等类似情形致使此次抽奖无效的，11对战平台因此免责。
              </p>
              <p style="color: #fff">
                4.任何由于网络问题、黑客攻击、计算机病毒侵入或发作、因政府管制而造成的暂时性关闭等影响网络正常运行的不可抗力而造成的非正常获奖无效，11对战平台均得免责。
              </p>
            </div>
          </div>
        </div>
      </transition>

      <!-- 免责声明 -->
      <!-- 活动中心 -->
      <transition name="fade">
        <div class="model" v-show="activeFlag">
          <div class="activeMain">
            <i class="close" v-on:click="activeFlag = false"></i>
            <h1 style="margin-bottom: 20px">
              活动中心-{{ baseData.map_name }}
            </h1>
            <ul>
              <li v-for="(item, index) in activeLts" v-bind:key="index">
                <p>{{ item.str_ed_time }}结束</p>
                <em
                  v-show="act_id == item.active_id"
                  class="current-act"
                  style="color: #fd0a0a"
                ></em>
                <h5 style="text-align: left">
                  【{{
                    item.active_type == 1
                      ? "抽奖活动"
                      : item.active_type == 3
                      ? "通行证活动"
                      : ""
                  }}】 {{ item.active_title }}
                </h5>
                <a
                  v-bind:href="
                    'qfyygame:///type=web_action/?action_type=2&web_url=' +
                    item.url +
                    '&login_mode=2'
                  "
                  class="ljcy"
                ></a>
              </li>
            </ul>
          </div>
        </div>
      </transition>
      <!-- 活动中心 -->
      <!-- 积分转化说明 -->
      <div class="model" v-show="jifenFlag">
        <div class="in-model">
          <i class="close" v-on:click="jifenFlag = false"></i>
          <h1>积分转化说明</h1>
          <div class="reward-detail">
            <p style="color: #fff">
              只有符合以下情况，抽中的奖项才会被转化为积分：
            </p>
            <p style="color: #fff">
              1.该奖项有设置转化积分，如没有设置则无法转化，具体请看活动页面抽奖说明；
            </p>
            <p style="color: #fff">
              2.抽取到的物品，玩家已经提前拥有永久时效的此物品，则抽取到相同的限时/永久物品时，系统将为玩家自动将抽取到的物品分解为当前地图签到积分；否则系统发放时会自动为玩家叠加此物品的时效；
            </p>

            <p style="color: #fff">
              3.积分余额和发放记录可通过签到页面【积分兑换-消耗记录】查询对应时间点的记录。
            </p>
          </div>
        </div>
      </div>
      <!-- 积分转化说明 -->
    </div>
    <!-- 无自定义模版结构 -->
  </div>
</template>
<script>
import $ from 'jquery'
import {
  GetData, GetLotteryDiscount, GetLimitedDetail, GetAwardList, BuyTicket, HasPayedOrder, LotteryOne, LotteryTen, LotteryDiscountCharge, RcvLimitedGift,
  GetUserLotteryLog, GetLimitedHistory, GetFreeLotteryLogByType, GetOrders, GetAllActivity
} from '@/api/request'
import { jsonTime } from "@/utils/utils"
import { Public } from "@/utils/Public"
import vueSeamlessScroll from 'vue-seamless-scroll'

export default {
  data () {
    return {
      temp_style: '',
      loading: '',
      num: 1,
      baseData: '',
      st_time: '',
      ed_time: '',
      ct_mine: 0,
      ct_need: 0,
      ct_send: 0,
      act_id: '',
      limitLts: [],
      winningList: [],
      len: 0,
      //滚动配置
      classOption: {
        waitTime: 1000,
        step: 0.5,
        openWatch: true,
        limitMoveNum: this.len,
        hoverStop: false,
        singleHeight: 50, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
      },
      buyQuanFlag: false,
      timerBuyPayedOrder: '',
      TenFlag: true,
      OneFlag: true,
      show_nameList: [],
      one__total_price: '',
      extend_msg: 0,
      oneModelFlag: false,
      TenFlagModel: false,
      TenRewardLists: [],
      ten_total_price: 0,
      extend_msg10: '',
      pi: 1,
      ps: 10,
      total: 0,
      rewardFlag: false,
      recordLists: [],
      mxFlag: false,
      mxDesc: '',
      limitFlag: false,
      limitLogLts: [],
      limitLogFlag: false,
      pi2: 1,
      ps2: 10,
      freeLogFlag: false,
      mzFlag: false,
      type_id: 1,
      total2: 0,
      freeLts: [],
      gmLogFlag: false,
      pi3: 1,
      ps3: 10,
      gmOrderLts: [],
      total3: 0,
      activeFlag: false,
      activeLts: [],
      tranLeft: 0,
      tranTop: 0,
      random_day: 0,
      price_total: 0,
      random_total: 0,
      random_week: 0,
      map_id: '',
      mini_url: '',
      show_qrcode: '',
      imageUrl: '',
      jifenFlag: false,
      isChecked: true,
      chargeChecked: true,
      tbtsFlag2: false,
      tbtsFlag: false,
      dhmxFlag: false

    }
  },
  watch: {
    "$route.params.id": {
      immediate: true, // 一开始的数据也要当做一种变化
      handler (val, old) {
        if (val) {
          debugger
          this.act_id = val
          this.getData()
          this._GetAwardList()
        } else {
          return
        }

      },
      immediate: true
    },
  },
  mounted () {
    console.log(this.$route.params.id)
    if (this.$route.params.id) {
      this.act_id = this.$route.params.id
      this.getData()
      this._GetAwardList()
    } else {
      return
    }
    var _that = this
    $(document).on('click', '#closeBtnPublic', function () {
      _that.closePubMd()
    })
  },
  components: {
    vueSeamlessScroll
  },
  methods: {
    ///通宝兑换明细
    chargeDetialFn () {
      this.dhmxFlag = true
    },
    //单选切换是否使用通宝
    handleChecked (event) {
      if (event.target.value) {
        this.tbtsFlag = true
      }
      console.log('event', event.target.value)
    },
    //获取奖券单选切换是否使用通宝
    chargeCheckedFn (event) {
      debugger
      if (event.target.value) {
        this.tbtsFlag2 = true
      }
      console.log('event', event.target.value)
    },
    tbtsFn2 () {
      this.chargeChecked = false
      this.tbtsFlag2 = false
    },
    tbtsFn () {
      this.isChecked = false
      this.tbtsFlag = false
    },
    onMouseOver (item, e) {

      this.tranLeft = (e.pageX - 197) + 'px'
      this.tranTop = (e.pageY - 233 - window.scrollY) + 'px'
      item.seen = true
    },
    onMouseOut (item) {
      this.tranLeft = 0
      this.tranTop = 0
      item.seen = false

    },
    getData () {
      //debugger
      // this.loading = this.$loading({
      //   lock: false,
      //   text: '',
      //   spinner: '',
      //   background: 'rgba(0, 0, 0, 0.7)'
      // })
      GetData(this.act_id).then(res => {
        console.log('11', res)
        if (res.data.temp_style == 1) {
          import('@/assets/css/index.css')
          this.temp_style = res.data.temp_style
          if (res.data.mini_url) {
            this.mini_url = res.data.mini_url
          }
          this.show_qrcode = res.data.show_qrcode
          ///this.loading.close()
        } else if (res.data.temp_style == 2) {
          import('@/assets/css/index2.css')
          this.temp_style = res.data.temp_style
          if (res.data.mini_url) {
            this.mini_url = res.data.mini_url
          }
          this.show_qrcode = res.data.show_qrcode
          // this.loading.close()
        } else if (res.data.temp_style == 3) {
          import('@/assets/css/index3.css')
          this.temp_style = res.data.temp_style
          if (res.data.mini_url) {
            this.mini_url = res.data.mini_url
          }
          this.show_qrcode = res.data.show_qrcode
          //this.loading.close()
        } else if (res.data.temp_style == 4) {
          import('@/assets/css/index4.css')
          this.temp_style = res.data.temp_style
          if (res.data.mini_url) {
            this.mini_url = res.data.mini_url
          }
          this.show_qrcode = res.data.show_qrcode
          // this.loading.close()
        } else if (res.data.temp_style == 5) {
          import('@/assets/css/index5.css')
          this.temp_style = res.data.temp_style
          if (res.data.mini_url) {
            this.mini_url = res.data.mini_url
          }
          this.show_qrcode = res.data.show_qrcode
          //this.loading.close()
        } else if (res.data.temp_style == -1) {
          import('@/assets/css/custom.css')
          this.temp_style = res.data.temp_style
          this.imageUrl = res.data.image
          if (res.data.mini_url) {
            this.mini_url = res.data.mini_url
          }
          this.show_qrcode = res.data.show_qrcode
        } else {
          import('@/assets/css/index5.css')
          this.temp_style = 5
          if (res.data.mini_url) {
            this.mini_url = res.data.mini_url
          }
          this.show_qrcode = res.data.show_qrcode
          //this.loading.close()
        }
        if (res.data.st_time) {
          this.st_time = jsonTime(res.data.st_time)
        }
        if (res.data.ed_time) {
          this.ed_time = jsonTime(res.data.ed_time)
        }
        this.baseData = res.data
        this.map_id = res.data.map_id
        if (res.data.show_discount) {
          this._GetLotteryDiscount()
        }
        if (res.data.show_limited) {
          this._GetLimitedDetail()
        }
      })
    },
    _GetLotteryDiscount () {
      GetLotteryDiscount(this.act_id).then(res => {
        console.log('22', res)
        this.ct_mine = res.data.ct_mine
        this.ct_need = res.data.ct_need
        this.ct_send = res.data.ct_send
      })
    },
    _GetLimitedDetail () {
      GetLimitedDetail(this.act_id).then(res => {
        this.limitLts = res.data
      })

    },
    _GetAwardList () {
      GetAwardList(this.act_id).then(res => {
        if (res.errCode == 0) {
          this.winningList = res.data
          this.len = res.data.length
        }

      })
    },
    async Ticket () {
      var _that = this
      if (this.num >= 999) {
        this.num = 999
      }

      const res = await BuyTicket(this.act_id, this.num)
      if (res.errCode == 0) {
        if (res.data.result_type == 1) {
          var publicModel = new Public()
          publicModel.src = res.data.url_src
          publicModel.width = 604
          publicModel.height = 420
          publicModel.init()
          _that._HasPayedOrder(res.data.log_id, 'buy')
        } else {
          this.$message({
            type: 'warning',
            message: res.msg
          })
        }
      } else if (res.errCode < 0) {
        this.$message({
          type: 'warning',
          message: res.msg
        })
      }

    },
    _HasPayedOrder (log_id, num) {
      this.timerBuyPayedOrder = setTimeout(async () => {
        const data = await HasPayedOrder(this.act_id, log_id)
        if (data.errCode == 0) {
          this.OneFlag = true
          this.TenFlag = true
          var publicModel = new Public()
          publicModel.flag = true
          publicModel.width = 604
          publicModel.height = 420
          publicModel.init()
          publicModel._closePublicModel()
          if (num == 1) {
            this.$message({
              type: 'success',
              message: '支付成功'
            })
            this._LotteryOne()

          } else if (num == 10) {
            this.$message({
              type: 'success',
              message: '支付成功'
            })
            this._LotteryTen()
          } else if (num == 'buy') {
            this.$message({
              type: 'success',
              message: '支付成功'
            })

            this.getData()
          }


        } else {
          this._HasPayedOrder(log_id, num)

        }
      }, 1000)

    },
    closePubMd: function () {
      var publicModel = new Public()
      publicModel._closePublicModel()
      clearInterval(this.timerBuyPayedOrder)
      this.TenFlag = true
      this.OneFlag = true
      this.getData()

    },
    handleChange (value) {
      console.log(value)
      this.num = value
    },
    //单抽
    async _LotteryOne () {
      var _that = this
      this.oneModelFlag = false
      this.TenFlagModel = false
      this.loading = this.$loading({
        lock: false,
        text: '',
        spinner: '',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      if (this.OneFlag) {

        this.OneFlag = false
        const res = await LotteryOne(this.act_id)
        this.OneFlag = true
        if (res.errCode != 0) {
          this.$message({
            type: 'warning',
            message: res.msg
          })
          this.loading.close()
          return false
        } else {
          if (res.data.result_type == 1) {
            var publicModel = new Public()
            publicModel.src = res.data.url_src
            publicModel.width = 604
            publicModel.height = 420
            publicModel.init()
            _that._HasPayedOrder(res.data.log_id, 1)
          } else {
            if (res.errCode == 0) {
              this.oneModelFlag = true
              _that.show_nameList = res.data.lst
              _that.one__total_price = res.data.total_price
              _that.extend_msg = res.data.extend_msg
              _that._GetAwardList()
            }
          }
        }
        this.loading.close()
        this.getData()
      }

    },
    closeOnceLottery () {
      this.oneModelFlag = false
    },
    //十抽
    async _LotteryTen () {
      var _that = this
      this.TenFlagModel = false
      this.oneModelFlag = false
      this.loading = this.$loading({
        lock: false,
        text: '',
        spinner: '',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      if (this.TenFlag) {
        this.TenFlag = false
        const res = await LotteryTen(this.act_id)
        this.TenFlag = true
        if (res.errCode != 0) {
          this.$message({
            type: 'warning',
            message: res.msg
          })
          this.loading.close()
          return false
        } else {
          if (res.data.result_type == 1) {
            var publicModel = new Public()
            publicModel.src = res.data.url_src
            publicModel.width = 604
            publicModel.height = 420
            publicModel.init()
            _that._HasPayedOrder(res.data.log_id, 10)
          } else {

            if (res.errCode < 0) {
              this.$message({
                type: 'warning',
                message: res.msg
              })
              _that.getData()

            } else if (res.errCode == 0) {
              _that.TenFlagModel = true
              _that.TenRewardLists = res.data.lst
              _that.ten_total_price = res.data.total_price
              _that.extend_msg10 = res.data.extend_msg
              _that._GetAwardList()
            }
          }

        }
        this.loading.close()
        this.getData()
      }

    },
    async _LotteryDiscountCharge () {
      const res = await LotteryDiscountCharge(this.act_id)
      if (res.errCode == 0) {
        this.$message({
          type: 'success',
          message: res.msg
        })
      } else {
        this.$message({
          type: 'warning',
          message: res.msg
        })
      }
      this.getData()
    },
    async _RcvLimitedGift (val) {
      const res = await RcvLimitedGift(this.act_id, val)
      //console.log('_RcvLimitedGift', res)
      if (res.errCode == 0) {
        if (res.data) {
          this.$message({
            type: 'success',
            message: `已经转换成${res.data}积分`
          })
        } else {
          this.$message({
            type: 'success',
            message: res.msg
          })
        }

      } else {
        this.$message({
          type: 'warning',
          message: res.msg
        })
      }
      this.getData()
    },
    closeTenLottery () {
      this.TenFlagModel = false

    },
    //中奖记录
    async _GetUserLotteryLog () {
      const res = await GetUserLotteryLog(this.act_id, this.pi, this.ps)
      console.log('zhongjiangjilv', res)
      if (res.errCode == 0) {
        this.rewardFlag = true
        this.random_day = res.random_day
        this.random_total = res.random_total
        this.random_week = res.random_week
        if (res.price_total) {
          this.price_total = res.price_total
        }

        this.total = res.total
        this.recordLists = res.data
      }
    },
    handleCurrentChange (val) {
      this.pi = val
      this._GetUserLotteryLog()
    },
    handleCurrentChange2 (val) {
      this.pi2 = val
      this._GetFreeLotteryLogByType()
    },
    handleCurrentChange3 (val) {
      this.pi3 = val
      this._GetOrders()
    },
    openMxDesc (val) {
      this.mxDesc = ''
      this.mxFlag = true
      this.mxDesc = val
    },
    async _GetLimitedHistory () {
      const res = await GetLimitedHistory(this.act_id)
      if (res.errCode == 0) {
        this.limitLogFlag = true
        this.limitLogLts = res.data
      } else {
        this.$message({
          type: 'warning',
          message: res.msg
        })
      }
    },
    async _GetFreeLotteryLogByType () {
      const res = await GetFreeLotteryLogByType(this.act_id, this.type_id, this.pi2, this.ps2)
      if (res.errCode == 0) {
        this.freeLogFlag = true
        this.total2 = res.data.total
        this.freeLts = res.data.data
      }
    },
    changeCur (val) {
      this.type_id = val
      this.pi2 = 1
      this.freeLts = []
      this._GetFreeLotteryLogByType()
    },
    async _GetOrders () {
      const res = await GetOrders(this.act_id, { pageIndex: this.pi3, pageSize: this.ps3 })
      if (res.errCode == 0) {
        this.gmLogFlag = true
        this.total3 = res.total
        this.gmOrderLts = res.data
      }
      //console.log(res)
    },
    async _GetAllActivity () {
      const res = await GetAllActivity(this.map_id)
      if (res.errCode == 0) {
        this.activeFlag = true
        this.activeLts = res.data
      }
      console.log(res)
    }

  }
}
</script>
<style>
@import url("@/assets/css/index.css");
</style>
